<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<style>
		#canvas{
			height:400px;
			width: 600px;
		}
	</style>
	<body>
		<canvas id="canvas" width="2560px" height="1280px" style="border: 3px solid #aaa;">不支持canvas</canvas>
		<script>
			var canvas = document.getElementById('canvas');
			var ctx = '';
			ctx = canvas.getContext('2d');
			var ball = {};
			ball.x = null;
			ball.y = null;
			var centerX = 200;
			var centerY = 150;
			var radiusX = 160;
			var radiusY = 80;
			
			for(var angle = 0; angle <= (Math.PI*2); angle += 0.1){
				ball.x =  centerX + Math.cos(angle)*radiusX;   
				ball.y =  centerY + Math.sin(angle)*radiusY;
				draw_ball(ctx, ball);
			}
			
			// 画点
		function draw_ball(ctx, ball) {
			console.log(ball);
			//设置绘制颜色
			ctx.fillStyle='green';
			//绘制成矩形
			// ctx.arc(ball.x, ball.y,5, 0, Math.PI * 5);
			ctx.fillRect(ball.x-4,ball.y-4,8,8);
			//设置字体样式
			ctx.font = "12px bold 宋体";
			//绘制文字
			//ctx.fillText("("+ball.x+","+ball.y+")",ball.x,ball.y);
			// ctx.fill();
		}
		</script>
	</body>
</html>
